<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns:th="https://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link th:href="@{/css/shop.css}" type="text/css" rel="stylesheet" />
    <link th:href="@{/css/Sellerber.css}" type="text/css"  rel="stylesheet" />
    <link th:href="@{/css/bkg_ui.css}" type="text/css"  rel="stylesheet" />
    <link th:href="@{/font/css/font-awesome.min.css}"  rel="stylesheet" type="text/css" />
    <link th:href="@{/css/BackgroudCss/MySet.css}" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" th:href="@{https://cdn.bootcss.com/bootstrap/3.0.0/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/css/jquery.minicolors.css}">
    <style type="text/css">
        body{overflow-y:auto; width:1330px; height:580px; overflow:auto; border:1px solid #000000;}

        #seat span{
            margin: 8px;
            text-align: center;
            line-height: 45px;
            cursor: pointer;
        }
        .imageDiv {
            display:inline-block;
            width:140px;
            height:120px;
            -webkit-box-sizing:border-box;
            -moz-box-sizing:border-box;
            box-sizing:border-box;
            border:1px dashed darkgray;
            background:#f8f8f8;
            position:relative;
            overflow:hidden;
            margin:10px;
            margin-left: 0;
        }
        .imageDiv img{
            width: 100%;
            height: 100%;
        }
        .cover {
            position:absolute;
            z-index:1;
            top:0;
            left:0;
            width:140px;
            height:120px;
            background-color:rgba(0,0,0,.3);
            display:none;
            line-height:105px;
            text-align:center;
            cursor:pointer;
        }
        .cover .delbtn {
            color:red;
            font-size:20px;
        }
        .imageDiv:hover .cover {
            display:block;
        }
        .addImages {
            display:inline-block;
            width:140px;
            height:120px;
            -webkit-box-sizing:border-box;
            -moz-box-sizing:border-box;
            box-sizing:border-box;
            /*border:1px dashed darkgray;*/
            background:#f8f8f8;
            position:relative;
            overflow:hidden;
            margin:10px;
        }
        .text-detail {
            margin-top:40px;
            text-align:center;
        }
        .text-detail span {
            font-size:40px;
        }
        .file {
            position:absolute;
            top:0;
            left:0;
            width:140px;
            height:120px;
            opacity:0;
        }
    </style>
    <script th:src="@{/js/jquery.min.js}" type="text/javascript"></script>
    <script th:src="@{/js/jquery.minicolors.js}" type="text/javascript"></script>
    <!--<script th:src="@{/js/jquery-1.9.1.min.js}" type="text/javascript" ></script>-->
    <script type="text/javascript" th:src="@{/js/jquery.cookie.js}"></script>
    <script th:src="@{/js/shopFrame.js}" type="text/javascript"></script>
    <script th:src="@{/js/Sellerber.js}" type="text/javascript"></script>
    <script th:src="@{/js/layer/layer.js}" type="text/javascript"></script>
    <script th:src="@{/js/laydate/laydate.js}" type="text/javascript"></script>
    <script type="text/javascript" th:src="@{/js/proTree.js}" ></script>
   <!-- <script th:src="@{/js/Backgroundjs/add_product.js}"></script>-->
    <script type="text/javascript" th:src="@{/js/Backgroundjs/MySeatAdd.js}"></script>
    <script type="text/javascript" th:src="@{/js/Backgroundjs/MySeatMenu.js}"></script>
    <script th:src="@{https://cdn.bootcss.com/bootstrap/3.0.0/js/bootstrap.min.js}"></script>
    <title>场地列表</title>
</head>
<body>
<div class="margin" id="page_style">
    <div class="add_administrator" id="add_administrator">
        <div class="add_style add_administrator_style" style="width:1200px;padding-left: 20px" >
            <form id="placeBaseInfo">
                <input type="hidden" th:value="${placeId}" id="seatType"/>
                <ul>
                    <li>
                        <label>场地名称：&nbsp;&nbsp;</label>
                        <input type="text" placeholder="请输入场地名称" name="placename" id="placename"/>
                        <label style="color: red;">&nbsp;&nbsp;必填项</label>
                    </li>
                    <li style="padding-left: 40px">
                        <label>省：&nbsp;&nbsp;</label>
                        <select name="cityoneId" id="province">
                            <!--<option value="0">全部</option>
                               <option value="0">山西省</option>-->
                        </select>
                        <label>市：&nbsp;&nbsp;</label>
                        <select name="citytwoId" id="city">
                            <!--<option value="0">全部</option>
                               <option value="0">太原市</option>-->
                        </select>
                        <label>区/县：&nbsp;&nbsp;</label>
                        <select name="citythreeId" id="area">
                            <!--<option value="0">全部</option>
                               <option value="0">小店区</option>-->
                        </select>
                        <label style="color: red;">&nbsp;&nbsp;必填项</label>
                    </li>
                    <li>
                        <label>场地地址：&nbsp;&nbsp;</label>
                        <input type="text" placeholder="请输入场地所在地址" name="address" id="address"/>
                        <label style="color: red;">&nbsp;&nbsp;必填项</label>
                    </li>
                    <li>
                        <label>座位行数：&nbsp;&nbsp;</label>
                        <input type="text" placeholder="请输入场地座位行数" name="rownum" id="rownum"/>
                        <label style="color: red;">&nbsp;&nbsp;必填项</label>
                    </li>
                    <li>
                        <label>座位列数：&nbsp;&nbsp;</label>
                        <input type="text" placeholder="请输入场地座位列数" name="columnnum" id="columnnum"/>
                        <label style="color: red;">&nbsp;&nbsp;必填项</label>
                    </li>
                    <li class="clearfix"><label class="label_name">场地图：&nbsp;&nbsp;</label>
                        <div id="Pic_pass">
                            <p style="font-size: 16px;font-weight: bold; color: red">请上传多张照片(*请先提交场地基本信息再上传场地图) </p>
                            <div class="picDiv">
                                <div class="addImages">

                                    <input type="file" class="file" id="uploadFilexxx" multiple="multiple" accept="image/png, image/jpeg, image/gif, image/jpg">
                                    <div class="text-detail">
                                        <span>+</span>
                                        <p style="margin-top: 0">点击上传</p>
                                    </div>
                                </div>
                                <button type="button" class="btn btn-lg btn-danger" id="bbt"style="width: 54px;height: 28px;padding: 4px 10px;font-size: 14px">上传</button>
                            </div>
                        </div>
                        <div class="msg" style="display: none;"></div>
                        <!--<div id="fileUp4" style="display:flex; justify-content:flex-start;width: 400px; flex-wrap: wrap;">
                            <div class="uploadImgBtn" id="uploadImgBtn" style='display:inline-block;width: 100px;height: 100px;background:url("images/Jia.png") no-repeat; background-size:100%'>
                                <input class="uploadImg" type="file" name="file" multiple id="file4" style="width: 100%;height: 100%;	">
                            </div>
                        </div>-->
                    </li>
                    <li style="text-align: center" id="find">
                        <input class="btn button_btn bg-deep-blue" type="button" id="addPlace" value="提交申请">
                        <input name="reset" type="reset" class="btn button_btn btn-infobtn-gray" value="取消重置" />
                    </li>
                </ul>
                <ul id="seatcolor">

                </ul>
                <div id="SeatInfo" style="width: 1400px">
                    <ul class="contextmenu">
                        <li><a href="#" id="SetCorridor">设为走廊</a></li>
                        <li><a href="#" id="CacleCorridor">取消走廊</a></li>
                        <li><a href="#" id="SetArea">设置区数</a></li>
                        <li><a href="#" id="CacalArea">取消区数</a></li>
                    </ul>
                    <div style="width: 100%;height: 100%;" id="seat">

                    </div>
                </div>
            </form>
        </div>
    </div>
    <div class="add_administrator " id="add_ticketfile" style="display:none; ">
        <div class="add_style add_administrator_style" style="width:400px;padding-left: 20px" >
            <form>
                <ul>
                    <li>
                        <label>票档名称:&nbsp;&nbsp;</label>
                        <input type="text" placeholder="请输入票档名称" name="ticketfilename" id="ticketfilename"/>
                    </li>
                    <li>
                        <label>座位区数:&nbsp;&nbsp;</label>
                        <input type="text" placeholder="请输入座位区数" name="areanum" id="areanum"/>
                    </li>
                    <li>
                        <label>票档颜色:&nbsp;&nbsp;</label>
                        <input type="text" id="hue-demo" class="demo" data-control="hue" value="#ff6161" style="width: 185px;">
                    </li>
                    <li style="text-align: center">
                        <input class="btn button_btn bg-deep-blue " type="button" id="addArem" value="提交申请">
                        <input name="reset" type="reset" class="btn button_btn btn-infobtn-gray" value="取消重置" />
                    </li>
                </ul>
            </form>
        </div>
    </div>
</body>
</html>
<script type="text/javascript">
    $(document).ready( function() {
        $('.demo').each( function() {
            $(this).minicolors({
                control: $(this).attr('data-control') || 'hue',
                defaultValue: $(this).attr('data-defaultValue') || '',
                inline: $(this).attr('data-inline') === 'true',
                letterCase: $(this).attr('data-letterCase') || 'lowercase',
                opacity: $(this).attr('data-opacity'),
                position: $(this).attr('data-position') || 'bottom left',
                change: function(hex, opacity) {
                    if( !hex ) return;
                    if( opacity ) hex += ', ' + opacity;
                    try {
                        console.log(hex);
                    } catch(e) {}
                },
                theme: 'bootstrap'
            });
        });
    });
    $("#SetArea").on('click', function(){
        SeatArray();
        $("#ticketfilename").val("");
        $("#areanum").val("");
        alert(array.length);
        if(array.length>0){
            layer.open({
                type: 1,
                title:'票档',
                area: ['420px',''],
                shadeClose: false,
                content: $('#add_ticketfile')
            });

        }else{
            layer.msg("请选择座位")
        }
    })
</script>

